<template>
    <div class='log'>
        <div class='log-img'>
            <img src='' alt=''>
        </div>
        <yd-cell-group v-model="forminfo">
            <yd-cell-item class='login-username'>
                <span slot='left'>用户名：</span>
                <yd-input slot='right' required v-model='forminfo.un' max='20' placeholder='请输入用户名'></yd-input>
            </yd-cell-item>
            <yd-cell-item class='login-password'>
                <span slot='left'>密&nbsp;&nbsp;&nbsp;&nbsp;码：</span>
                <yd-input slot='right' type='password' v-model='forminfo.pw' placeholder='请输入密码'></yd-input>
            </yd-cell-item>
        </yd-cell-group>
        <div class='login-box'>
            <yd-button size='large' type='primary' class='longin-btn' @click.native='login()'>登录</yd-button>
        </div>
        <router-link to='login/register' tag='div' class='register-link'>注册新的用户</router-link>
    </div>
</template>
<script>
import axios from "axios";
export default {
    data() {
        return {
            forminfo: {
                un: "",
                pw: ""
            }
        };
    },
    created() {
        axios.defaults.withCredentials = true;
        axios.get("http://wx-chiming.subei88.com/api/WeiXinUser/TestLogin?Id=2").then(e => {
                this.list = e.data;
                console.log(this.list);
            });
    },
    methods: {
        login() {
            axios
                .post("http://wx-chiming.subei88.com/api/Weixin/MemberLogin", {
                    UserName: this.forminfo.un,
                    UserPwd: this.forminfo.pw
                    // UserName: "333",
                    // UserPwd: "123456"
                })
                .then(e => {
                    if (e.data.status) {
                        this.$router.push({ name: "Register" });
                        console.log('登录成功')
                    } else {
                        alert(e.data.info);
                    }
                    this.list = e.data;
                    console.log(this.list);
                });
        }
    }
};
</script>

<style>
* {
    margin: 0 auto;
    border: 0;
    padding: 0;
}
.log {
    width: 100%;
}
.log-img {
    height: 4rem;
    width: 100%;
    background-color: #3e92f5;
}
.login-username {
    height: 1rem;
    margin-top: 0.3rem;
}
.yd-cell-left {
    font-size: 0.3rem;
    padding-left: 0.45rem;
}
.yd-cell-right .yd-input input {
    font-size: 0.3rem;
    width: 90%;
}
.yd-input {
    width: 90%;
}
.yd-input-warn:after,
.yd-input-success:after,
.yd-input-password:after {
    /* padding-right: 0.45rem; */
    font-size: 0.45rem;
}
.login-password {
    height: 1rem;
}
.login-box .yd-btn-primary {
    margin: 0.2rem auto;
    height: 0.8rem;
    background: #3e92f5;
    border-radius: 0.2rem;
    width: 60%;
    overflow: hidden;
}
.register-link {
    text-align: center;
}
.el-message-box {
    width: 80%;
    height: 3rem;
    margin: 0 auto;
    font-size: 0.35rem;
}
</style>